<template>
  <div>
    <!-- 标题 -->
    <div :class="className">{{title}}</div>
  </div>
</template>
<script>
export default {
  props: {
   title:{
     type: String
   },
   level:{
     type: String
   }
  },
  data(){
    return{
      className: null
    }
  },
  watch:{
   'level':{
     handler(newVal,oldVal){
       if(newVal == 1){
         this.className = 'word-title-1'
       } else if (newVal == 2){
         this.className = 'word-title-2'
       } else if (newVal == 3){
         this.className = 'word-title-3'
       } else {
         this.className = 'word-title-4'
       }
     },
     immediate: true
   }
  }
}
</script>